<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'name2.jsp' starting page</title>
    <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js"></script>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<script type="text/javascript">
	$(function(){
		//给username派发一个失去焦点事件 发送ajax请求
		$("input[name='username']").blur(function(){
			//获取输入的值
			var $value=$(this).val();
			//alert($value);
			var params={"username":$value};
			//ajax 方式
			 $.ajax({
				url:"userservlet",
				type:"get",
				data:params,
				//dataType:"text",
				dataType:"json",
				//参数d是指服务器返回的参数
				success:function(d){
					//alert(d);
					//if(d==true),此为json验证模式
					 if(d==true){
						$("#span").html("<font color='green'>用户名可以使用</font>");
					}else{
						$("#span").html("<font color='red'>用户名已被使用</font>");
					}   
				}
				
			}); 
			 
		});
	})
	
	
	</script>
  </head>
  
  <body>
    <form action=# >
    用户名：<input type="text" name="username" >
    <span id="span"></span><br/>
    <input type="submit" value="提交" id="sub">
    </form>
  </body>
</html>
